import React,{Suspense} from 'react'
import routes from './Router_config'
import {BrowserRouter,Route,Routes,Navigate} from "react-router-dom"
import {RouterList,RouterItem} from "../untils/index"
type Props = {
  arr?:number[]
}

const RouterView = (props: Props) => {
  const renderrouter=(arr:RouterList)=>{
    return arr.map((item:RouterItem,index:number)=>{
     return <Route path={item.path} key={index} element={
      item.element?<item.element/>:<Navigate to={item.to as string}/>
     }>{
      item.children&&renderrouter(item.children)
     }</Route>
    })
  }
  return (
   <Suspense fallback={<div>路由加载中...</div>}>
    <BrowserRouter>
    <Routes>
    {
    renderrouter(routes)
    }
    </Routes>
    </BrowserRouter>
   </Suspense>
  )
}

export default RouterView